@extends('layouts.appManager')

@section('title')服务端授权管理 - @endsection

@section('style')

@endsection

@section('content')
    <div class="container py-5">

        <h3>特色服务端授权</h3>
        <br>
        <div style="text-align: end">
            <el-button type="primary" size="small" @click="curItem={...newItem};dialogVisible=true" :disabled="list.length>=100">
                添加授权
            </el-button>
        </div>
        <el-table
            :data="list"
            style="width: 100%">
            <el-table-column
                prop="guid"
                label="授权码"
                width="350">
            </el-table-column>
            <el-table-column
                prop="ip"
                label="绑定ip"
                width="150">
                <template slot-scope="scope">
                    <el-tooltip v-if="scope.row.ip" effect="dark" content="每30天可以解绑一次，点击解绑" placement="top">
                        <el-button @click="clearIP(scope.row)" type="warning" plain size="mini">@{{ scope.row.ip }}</el-button>

                </template>
            </el-table-column>
            <el-table-column
                prop="endTime"
                label="到期时间"
                width="300">
                <template slot-scope="scope">
                    @{{ scope.row.endTime }}
                    <br>
                    <el-tooltip effect="dark" content="测试期间价格特惠，超过50天无法续费" placement="top">
                        <el-button @click="addTime(scope.row)" :type="scope.row.enable?( scope.row.enableDays<7?'warning':'primary'):'danger' " plain size="mini"> @{{ getServerEnableTxt(scope.row) }} | 续费1个月（1 积分）</el-button>
                    </el-tooltip>
                </template>
            </el-table-column>
            <el-table-column
                prop="info"
                label="备注"
                >
                <template slot-scope="scope">
                    @{{ scope.row.info }}
                </template>
            </el-table-column>
            <el-table-column width="160" label="操作">
                <template slot-scope="scope">
<!--                    <el-button type="default" plain size="small" @click="del(scope.row.id)">
                        续费
                    </el-button>-->
                    <el-button type="danger" plain size="small" @click="del(scope.row.id)">
                        删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>

    <el-dialog
        title="添加授权"
        v-if="curItem"
        :visible.sync="dialogVisible"
        width="30%">
        <div>
            <el-form label-width="80px">
                <el-form-item label="备注">
                    <el-input v-model="curItem.info" placeholder="请输入备注" maxlength="20"></el-input>
                </el-form-item>
            </el-form>
        </div>
        <span slot="footer" class="dialog-footer">
            <el-button type="primary" @click="add">保 存</el-button>
        </span>
    </el-dialog>

@endsection

@section('script')
    <script>
        var app = new Vue({
            el: '#app',
            data: {
                list:[],
                list_serverEngine:[],
                curItem: null,
                newItem: {
                    id:0,
                    info:'',
                },
                dialogVisible:false,
            },
            mounted() {
                this.getList();
            },
            filters:{

            },
            methods:{
                clearIP(item){
                    let t=this;
                    post('authSingle/clearIP', {id:item.id},res=>{
                        if (res.err===0){
                            item.ip='';
                            this.$message({
                                type: 'success',
                                message: '解绑成功'
                            });
                        }else{
                            this.$message({
                                type: 'error',
                                message: res.msg
                            });
                        }

                    },t)
                },
                getServerEnableTxt(server){
                    if (server.enable)
                        return "剩余: "+server.enableDays +" 天";
                    else
                        return "过期: "+-server.enableDays +" 天";
                },
                addTime(item){
                    let t=this;
                    post('authSingle/addtime', {id:item.id},res=>{
                        if (res.err===0){
                            item.endTime=res.data.endTime;
                            item.enable=res.data.enable;
                            item.enableDays=res.data.enableDays;
                            this.$message({
                                type: 'success',
                                message: '续费成功'
                            });
                        }else{
                            this.$message({
                                type: 'error',
                                message: res.msg
                            });
                        }

                    },t)
                },
                getList(){
                    let t=this;
                    post('authSingle/list',{},res=>{
                        t.list=res.list;
                    },t)
                },
                add(){
                    let t=this;
                    if (t.list.length>=100){
                        t.$message({
                            type: 'info',
                            message: '最多添加100个授权'
                        });
                        return;
                    }
                    post('authSingle/add',t.curItem,res=>{
                        t.getList();
                        t.dialogVisible=false;
                        this.$message({
                            type: 'success',
                            message: '添加成功'
                        });
                    },t)
                },
                del(id){
                    let t=this;
                    post('authSingle/del',{id:id},res=>{
                        if (res==='1'){
                            t.getList();
                            this.$message({
                                type: 'success',
                                message: '删除成功'
                            });
                        }else{
                            this.$message({
                                type: 'error',
                                message: '删除失败'
                            });
                        }
                    },t)
                }
            }
        });
    </script>
@endsection
